<template>
  <div>
    <md-field >
      <md-skeleton title :loading="remoteDataLoading" :row="8">
        <md-field>
          <p style="text-align:center; margin-top:40px;">
            <span style="display:block; font-size:20px;"><template v-if="userInfo">{{userInfo.nickname}}</template></span>
          </p>
        </md-field>
        <md-field>
          <md-field-item></md-field-item>
          <md-button type="primary" @click="onGotoHome" >回首页</md-button>
        </md-field>
      </md-skeleton>
    </md-field>
  </div>
</template>

<script>
import { mapGetters } from "vuex"
import { Field, CellItem, Skeleton, Button, FieldItem } from 'mand-mobile'

export default {
  name: "Profile",
  components: {
    [Field.name]: Field,
    [CellItem.name]: CellItem,
    [Skeleton.name]: Skeleton,
    [Button.name]: Button,
    [FieldItem.name]: FieldItem
  },
  data () {
    return {
      remoteDataLoading: false
    }
  },
  computed: {
    ...mapGetters(['userInfo'])
  },
  created () {
    const { fullPath } = this.$router.currentRoute
    console.log('fullPath：' + fullPath)
    if (!this.userInfo) {
      this.$store.dispatch("USERINFO")
    }
  },
  mounted () {
  },
  methods: {
    onGotoHome () {
      this.$router.push({ path: '/' })
    }
  }
}
</script>
